<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<section class="mysection">
		<div class="section_center">

			<!-- top mddile 上 -->
			<div class="top_carousel_tabs">
				<div class="myCarousel">
					<ul id="mytabs">
						<?php
							if($articleList){
								$num = 0;
								foreach($articleList as $val){

									if($val['state'] === '0' && $val['slide'] === '1'){
										$num ++;
										$urlImg = './admin'.mb_substr($val['img'], 1);

										echo '<li>
											<a href="./index.php?param=article_details&id='. $val['id'] .'"><img src="'. $urlImg .'" alt=""></a>
										</li>';
									}
								}
							}
						?>
					</ul>

					<a id="priv" class="iconfont icon-shangyiye1" href="javascript:;"></a>
					<a id="next" class="iconfont icon-xiayiye" href="javascript:;"></a>

					<div class="tabs_dot">
						<?php
							for($i = 0; $i < $num; $i++){
								
								echo '<p></p>';
							}
						?>
					</div>
				</div>

				<!-- 公告 -->
				<div class="myOntice">
					<div class="ontice_center">
						<div class="ontice_title">
							<h3>个人博客，属于自己的小世界！</h3>
						</div>
						<div class="ontice_middle">
							<ul>
								<li>
									<a href="javascript:;">
										【告别2018】耕耘才有所得，付出才有收获
									</a>
								</li>
								<li>
									<a href="javascript:;">
										十条设计原则教你学会如何设计网页布局!
									</a>
								</li>
								<li>
									<a href="javascript:;">
										别让这些闹心的套路，毁了你的网页设计
									</a>
								</li>
								<li>
									<a href="javascript:;">	
										自己不会个人博客网站制作，你会选择用什么博客程序源码？
									</a>
								</li>
								<li>
									<a href="javascript:;">	
										作为一个设计师,如果遭到质疑你是否能恪守自己的原则?
									</a>
								</li>
								<li>
									<a href="javascript:;">	
										企业网站建设前期，公司该做什么样的网站？要看企
									</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>

			<!-- 选项卡 盒子模块 tabs-->
			<div class="mytabControl">
				<div class="tabControl_center">
					<div class="tabControl_title">
						<ul>
							<li>建设网站</li>
							<li>HTML/CSS</li>
							<li>个人博客模板</li>
						</ul>
						<span id="dot_line"></span>
					</div>
					<div class="tabControl_middle active">
						<div class="tabControl_middle_list_l">
							<div class="article_img"><img src="./public/image/1.jpg" alt=""></div>
							<div class="article_img"><img src="./public/image/3.jpg" alt=""></div>
						</div>
						<div class="tabControl_middle_list_r">
							<ul>

								<li class="active">
									<a href="javascript:;">7年，一个80后女站长与阿里云携手创业的真实故事...</a>
									<p>我是一名80后女站长，从09年毕业到现在我一直从事的是互联网的工作。阿里云成立的年份是2009年，一个是正在成长中的阿里云，一个是刚毕业到处找工作的我。</p>
								</li>

								<li>
									<a style="content: '2';" href="javascript:;">【告别2018】耕耘才有所得，付出才有收获</a>
									<p>网站模板我更新速度是很慢的，数了一下，大概12个模板，不多，但是每一套个人博客网站模板都是我精心设计的，期间认识了很多做优化的朋友还有客户，根据他们的</p>
								</li>
								<li>

									<a href="javascript:;">YzmCMS轻量级开源CMS系统推荐</a>
									<p>YzmCMS是一款轻量级开源内容管理系统，它是由袁志蒙自主研发的框架YZMPHP开发。YzmCMS v5.2 新增或修正功能:1.数据库操作新增PDO驱动，并采用预处理，系</p>
								</li>

								<li>
									<a href="javascript:;">网易博客关闭，何不从此开始潇洒行走江湖！</a>
									<p>从网易博客平台的出现，到现在已经有12个年头了，很多人还坚持着，网易博客一宣布关闭，很多人都很惋惜，那么多的文字记忆，又该如何是好？虽然可以一键搬迁到</p>
								</li>
								<li>
									<a href="javascript:;">个人网站做好了，百度不收录怎么办？来，看看他们怎么做的。</a>
									<p>不管你是学前端的还是后端的，作为一个程序员，做一个自己的博客，那是必然的。咱们的圈子就这么大，想让更多的人了解你，看看你的技术多牛逼，扔一个博客地址</p>
								</li>
							</ul>
						</div>
					</div>
					<div class="tabControl_middle">
						<div class="tabControl_middle_list_l">
							<div class="article_img"><img src="./public/image/1.jpg" alt=""></div>
							<div class="article_img"><img src="./public/image/3.jpg" alt=""></div>
						</div>
						<div class="tabControl_middle_list_r">
							<ul>

								<li class="active">
									<a href="javascript:;">7年，一个80后女站长与阿里云携手创业的真实故事...</a>
									<p>我是一名80后女站长，从09年毕业到现在我一直从事的是互联网的工作。阿里云成立的年份是2009年，一个是正在成长中的阿里云，一个是刚毕业到处找工作的我。</p>
								</li>

								<li>
									<a href="javascript:;">【告别2018】耕耘才有所得，付出才有收获</a>
									<p>网站模板我更新速度是很慢的，数了一下，大概12个模板，不多，但是每一套个人博客网站模板都是我精心设计的，期间认识了很多做优化的朋友还有客户，根据他们的</p>
								</li>
								<li>

									<a href="javascript:;">YzmCMS轻量级开源CMS系统推荐</a>
									<p>YzmCMS是一款轻量级开源内容管理系统，它是由袁志蒙自主研发的框架YZMPHP开发。YzmCMS v5.2 新增或修正功能:1.数据库操作新增PDO驱动，并采用预处理，系</p>
								</li>

								<li>
									<a href="javascript:;">网易博客关闭，何不从此开始潇洒行走江湖！</a>
									<p>从网易博客平台的出现，到现在已经有12个年头了，很多人还坚持着，网易博客一宣布关闭，很多人都很惋惜，那么多的文字记忆，又该如何是好？虽然可以一键搬迁到</p>
								</li>
								<li>
									<a href="javascript:;">个人网站做好了，百度不收录怎么办？来，看看他们怎么做的。</a>
									<p>不管你是学前端的还是后端的，作为一个程序员，做一个自己的博客，那是必然的。咱们的圈子就这么大，想让更多的人了解你，看看你的技术多牛逼，扔一个博客地址</p>
								</li>
							</ul>
						</div>
					</div>
					<div class="tabControl_middle">
						<div class="tabControl_middle_list_l">
							<div class="article_img"><img src="./public/image/1.jpg" alt=""></div>
							<div class="article_img"><img src="./public/image/3.jpg" alt=""></div>
						</div>
						<div class="tabControl_middle_list_r">
							<ul>

								<li class="active">
									<a href="javascript:;">7年，一个80后女站长与阿里云携手创业的真实故事...</a>
									<p>我是一名80后女站长，从09年毕业到现在我一直从事的是互联网的工作。阿里云成立的年份是2009年，一个是正在成长中的阿里云，一个是刚毕业到处找工作的我。</p>
								</li>

								<li>
									<a href="javascript:;">【告别2018】耕耘才有所得，付出才有收获</a>
									<p>网站模板我更新速度是很慢的，数了一下，大概12个模板，不多，但是每一套个人博客网站模板都是我精心设计的，期间认识了很多做优化的朋友还有客户，根据他们的</p>
								</li>
								<li>

									<a href="javascript:;">YzmCMS轻量级开源CMS系统推荐</a>
									<p>YzmCMS是一款轻量级开源内容管理系统，它是由袁志蒙自主研发的框架YZMPHP开发。YzmCMS v5.2 新增或修正功能:1.数据库操作新增PDO驱动，并采用预处理，系</p>
								</li>

								<li>
									<a href="javascript:;">网易博客关闭，何不从此开始潇洒行走江湖！</a>
									<p>从网易博客平台的出现，到现在已经有12个年头了，很多人还坚持着，网易博客一宣布关闭，很多人都很惋惜，那么多的文字记忆，又该如何是好？虽然可以一键搬迁到</p>
								</li>
								<li>
									<a href="javascript:;">个人网站做好了，百度不收录怎么办？来，看看他们怎么做的。</a>
									<p>不管你是学前端的还是后端的，作为一个程序员，做一个自己的博客，那是必然的。咱们的圈子就这么大，想让更多的人了解你，看看你的技术多牛逼，扔一个博客地址</p>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>

			<!-- 最新文章 -->
			<div class="myLatestArticle">
				<div class="title">
					<h2>最新文章</h2>
				</div>
				<!-- 最新文章left -->
				<div class="latestArticle_left">
					<?php
						if($articleList){
							foreach($articleList as $val){
								if($val['state'] === '0'){

									$urlImg = './admin'.mb_substr($val['img'], 1);
								echo '<div class="latestArticle_list">
									<div class="latestArticle_list_c">
							<div class="latestArticle_list_title">
								<a href="./index.php?param=article_details&id='. $val['id'] .'">'. $val['title'] .'</a>
							</div>
							<div class="latestArticle_list_middle">
								<div class="list_middle_left article_img">
									<img src="'. $urlImg .'" alt="">
								</div>

								<div class="list_right">
									<p>
									'. $val['describe'] .'...</p>
									<div id="list_right_b">
										<ul>
											<li>
												<i class="iconfont icon-lishibisai"></i>
												<a href="javascript:;">'. $val['intime'] .'</a></li>
											<li>
												<i class="iconfont icon-yulan"></i>
												<a href="javascript:;">'. $val['browse'] .'已阅读</a></li>
											<li>
												<i class="iconfont icon-zan1"></i>
												<a href="javascript:;">'. $val['praise'] .'</a>
											</li>
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>';
								}
							}
						}
					?>
				</div>

				<!-- 最新文章right -->
				<div class="latestArticle_right">
					<div class="latestArticle_right_c">
						<div class="latestArticle_title article_title">
							<h2>特别推荐</h2>
						</div>

						<div class="latestArticle_middle">
							<ul class="middle_list">
								<?php
									if($heat){
										foreach($heat as $val){
											if($val['state'] === '0'){

												$urlImg = './admin'.mb_substr($val['img'], 1);
											echo '<li>
												<img src="'. $urlImg .'" alt="">
												<p>'. $val['title'] .'</p>
												<a href="./index.php?param=article_details&id='. $val['id'] .'">阅读</a>
												<span id="back_dot"></span>
											</li>';
											}
										}
									}
								?>
							</ul>
						</div>
					</div>
				</div>
			</div>

			<!--  -->
		</div>
	</section>
</body>
</html>